<template>
	<view class="classList">
		<view class="loadingLayout" v-if="!classList.length &&!noData">
			<uni-load-more status="loading"></uni-load-more>
		</view>
		<view class="content">		
			<navigator :url="'/pages/preview/preview?id='+i._id+'&name='+queryParams.name" class="item"
			v-for="i in classList" :key="i._id">
				<image :src="i.smallPicurl" mode="aspectFill"></image>
			</navigator>
		</view>
	</view>

	<view class="loadingLayout" v-if="classList.length || noData">
		<uni-load-more :status="noData?'noMore':'loading'"></uni-load-more>
	</view>
	
	<view class="safe-area-inset-bottom"></view>

</template>

<script setup>
import { ref } from 'vue';
import { apiGetClassList, apiGetHistoryList } from '../../Api/api';
import { onLoad, onReachBottom, onUnload, onShareAppMessage, onShareTimeline } from '@dcloudio/uni-app';
import { gotoHome } from "@/utils/common.js"

const props = defineProps({
	id: String,
	name: String
})

const classList = ref([])
const queryParams = {
	pageNum:1,
	pageSize:12
}
const noData= ref(false)

// const loading = ref()

//获取分类图片数据
const getClassList = async ()=>{
	let res
	if(queryParams.classid) {
		res = await apiGetClassList(queryParams)
	}
	
	if(queryParams.type) {
		res = await apiGetHistoryList(queryParams)
	}
	// console.log(res);
	classList.value = [...classList.value , ...res.data];
	if(queryParams.pageSize > res.data.length) noData.value = true
	//存储信息到本地缓存
	uni.setStorageSync("storgClassList",classList.value)
	// console.log(classList.value);
}

let pageName
// 获取url信息
onLoad((e)=>{
	// console.log(e);
	let { id=null, name=null, type=null } = e
	if(type) queryParams.type = type
	if(id) queryParams.classid = id;
	// console.log(id, name)
	queryParams.classid = id;
	queryParams.name = name;
	pageName = name
	
	// console.log(queryParams.classid);
	
//需要改导航标题	
	uni.setNavigationBarTitle({
		title:pageName
	})
	
	getClassList()
})

onReachBottom(()=>{
	if(noData.value) return
	queryParams.pageNum++
	getClassList()
	
})

//分享模块
onShareAppMessage((e)=>{
	return {
		title:"壁纸推荐—su"+pageName,
		path:"/pages/classList/classList?id="+queryParams.classid+"&pageName",
		// imageUrl:'/static/xxmLogo.png'
	}
})

//分享朋友圈
onShareTimeline((e) =>{
	return {
		title:"壁纸推荐~su",
		query:"id="+queryParams.classid+"&pageName",
		imageUrl:'/static/xxmLogo.png'
	}
})  


onUnload(()=>{
	uni.removeStorageSync("storgClassList")
})
</script>

<style lang="scss" scoped>
.classList{
	.content{
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 7rpx;
		padding: 5rpx 15rpx;
		.item{
			height: 440rpx;
			image{
				width: 100%;
				height: 100%;
				display: block;
			}
		}
	}
}
</style>
